<html>
<head>
    <!-- <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> -->
    <!-- 上面的引入的是最新1.11版本的，在引入qqface时出现问题mist移除了，所以用1.8版本的，就是qqFace自带的jquery文件 -->
    <script src="__STATIC__/chat/js/jquery.min.js"></script>
    <script src="__STATIC__/qqFace/js/jquery.qqFace.js"></script>
    
    <link rel="stylesheet" href="__STATIC__/chat/css/chat.css">
    <style>
		
    </style>
	<title>redis购物车案例</title>
</head>
<body>
	<div class="content">
		<!-- 头部 -->
		<div class="head">
			<div class="shop-title">购物车redis＋数据库实现</div>
		</div>
		<!-- 商品展示 -->
		<div class="good">
			<div class="goodhead">商品列表</div>
			{volist name='data' id='vo' }
			<div class="goods">
				<div class="goodimg">{$vo.id}{$vo.img}</div>
				<div class="des">{$vo.name}</div>
				<div class="price">{$vo.price}</div>
				<div class="gw1" name={$vo.id}>购物车-1</div>
				<div class="gw2" name={$vo.id}>购物车+1</div>
			</div>
			{/volist}
			
		</div>
		<!-- 购物车列表 -->
		<div class="cat">
			<div class="goodhead">购物车列表</div>
			{volist name='res' id='vi'}
			<div class="goods">
				<div class="goodimg">{$vi.name}</div>
				<div class="des">购物车数量{$vi.num}</div>
				<div class="price">{$vi.price}</div>
				<div class="gw1" name={$vi.id}>购物车-1</div>
				<div class="gw2" name={$vi.id}>购物车+1</div>
			</div>
			{/volist}
		</div>
	</div>




	<script>
	var goodid;

	var API_URL = "http://redis.gw/index.php/index/index/";
		$('.gw2').click(function(){
			var goodid = $(this).attr('name'); //获取点击购物车的商品id
			console.log($(this).attr('name'));
			addRedis(goodid);
			location.reload();    // 刷新页面
		})
		$('.gw1').click(function(){
			var goodid = $(this).attr('name');
			console.log($(this).attr('name'));
			delcart(goodid);
			location.reload();
		})
		function addRedis(goodid){   // 发送ajax请求
			$.post(
				API_URL+'addcart',
				{"userid":1,"goodid":goodid},
				function(){
					console.log('执行成功');
				},'json'
			)
		}
		function delcart(goodid){
			$.post(
				API_URL+'delcart',
				{"userid":1,"goodid":goodid},
				function(){
					console.log('执行成功');
				},'json'
			)
		}
		
	</script>
</body>
</html>